Welcome to Css!

7.09 背景简写

background: 颜色值 颜色图片 背景重复 背景定位/背景尺寸 背景固定;

1、 可以在一个属性中设置所有背景属性,用空格隔开

2、 如果某个值不写,也不会出问题;

3、 使用背景简写,输入的代码最小,浏览器对背景简写支持度更高。

4、 背景定位要写在背景尺寸之前,中间要有一条斜线分隔,有背景尺寸一定要写背景定位。

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<title>css</title>

<style type="text/css">

div{

width:300px;height:1000px;

background-image:url(css7.03.01.png);

background-repeat:no-repeat;

background-attachment:fixed;

background-color:#ff00ff;

background-position:40px 50px;

background-size:80px 60px;

}

</style>

</head>

<body>

<div></div>

</body>

</html>

返回值如下:

换成如下代码如果同上:

div{

width:300px;height:1000px;

width:300px;height:1000px;

background:

#ff00ff

url(css7.03.01.png)

no-repeat

40px 50px/80px 60px

fixed;

}